{extend name="common/base" /}

{block name="style"}
<link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm-extend.css">
<link rel="stylesheet" href="__CDN__/html/css/weui.min.css">

<link rel="stylesheet" href="__CDN__/html/css/scroll.css">
<style type="text/css">
    body{
        background: #F5F5F5;
        touch-action: none;
        overflow-y: scroll;
    }


</style>
{/block}
{block name="body"}
<div class='smrz-bj'>
    <div class="sy-mains">
        <div class="sy-top">
            <div class="swiper-container" style="height:1.55rem;padding-bottom:0;">
                <!-- Additional required wrapper -->
                <div class="swiper-wrapper">
                    <!-- Slides -->
                    {foreach $banner_list as $vo }
                    <div class="swiper-slide">
                        {if ($vo['jump_type']==1)}
                        <a href="{$vo.ad_link}">
                            {/if}
                            <img src="{$vo.ad_img}" />
                            {if ($vo['jump_type']==1)}
                        </a>
                        {/if}
                    </div>
                    {/foreach}
                </div>
            </div>
            <!--<img src="__CDN__/html/img/hz-img11.png">-->
        </div>
        <div class="sy-top-xx">

            <div class="xx-list" {empty name="$banner_text_list"}style="display:none;"{/empty}>
                 <img src="__CDN__/html/img/hz-img19.png" class="xx-img" style="float:left;margin-top: 0.13rem;">
                <ul class="_container" id="ad-text" style="float:left;" >

                    {foreach $banner_text_list as $vo }
                    <li style='width:100%;overflow: hidden;'>
                        <div style="width:25%;float: left;">
                            <span class="xx-span">{$vo.ad_title}</span>
                        </div>

                        <div class="sxx-span2" style="width:75%;float: left;">
                            {$vo.ad_subtitle}
                        </div>
                    </li>
                    {/foreach}

                </ul>
            </div>

            <ul class="xx-nav" style="width:100%;">
                <a href="{:url('box/apply')}">
                    <li>
                        <img src="__CDN__/html/img/hz-img20.png" class="img1">
                        <p class="xx-li-p">申请箱子</p>
                    </li>
                </a>
                <a href="{:url('box/index')}">
                    <li>
                        <img src="__CDN__/html/img/hz-img21.png" class="img2">
                        <p class="xx-li-p xx-li-ps">申请补货</p>
                    </li>
                </a>
                <a href="{:url('My/index')}">
                    <li>
                        <img src="__CDN__/html/img/hz-img22.png" class="img3">
                        <p class="xx-li-p">个人中心</p>
                    </li> 
                </a>
            </ul>
        </div>

        <div class="sy-gw">
            <input type="hidden" id="cate_id" value="{$cate_id}" >
            <ul class="sy-gw-left">
                <a href="{:url('index',['cate_id'=>0])}" > <li {eq name="$cate_id" value="0" } class="active" {/eq} >全部</li></a>
                {foreach $cate_list as $vo }
                <a href="{:url('index',['cate_id'=>$vo['cate_id']])}" > <li {eq name="$vo['cate_id']" value="$cate_id" } class="active" {/eq} >{$vo['cate_title']}</li></a>
                {/foreach}
            </ul>
            <div class="sy-gw-rig mui-scroll-wrapper" id="pullrefresh" style="position:static;z-index:0;">
                <div class="mui-scroll" style="position:static;z-index:0;">
                    <ul class="sy-gw-rig1"  data-distance="50">
                        {foreach $goods_list as $vo }
                        <li>
                            <img data-id="{$vo.box_goods_id}" src="{$vo.goods_logo}" class="rig-img js-show-detail">
                            <div class="gw-rig-div">
                                <p class="rig-div-p js-show-detail" data-id="{$vo.box_goods_id}" >【{$vo.brand_title}】{$vo.goods_title}，{$vo.goods_spec}</p>
                                <div class="rig-bottom">
                                    <span class="rig-span">¥{$vo.selling_price}</span>
                                    <div class="sz-jg">
                                        <img src="__CDN__/html/img/hz-img26.png" data-id="{$vo['box_goods_id']}" data-type="0" data-ope="0" class="img-jg change-num js-dec-num-{$vo['box_goods_id']}" {if $vo['buy_num'] ==0 }style="display:none;"{/if}>
                                             <input type="text" value="{$vo.buy_num}" class="text-inp js-goods-num-{$vo['box_goods_id']}" {if $vo['buy_num'] ==0 }style="display:none;"{/if}  disabled="disabled">
                                             <img src="__CDN__/html/img/hz-img23.png" data-id="{$vo['box_goods_id']}" data-type="0" data-ope="1" class="img-jg change-num js-inc-num-{$vo['box_goods_id']}">
                                    </div>
                                </div>
                            </div>
                        </li>
                        {/foreach}

                    </ul>
                </div>
            </div>
        </div>
    </div>

    <div class="sy-bottom">
        <div class="bottom-img js-show-cart">
            <img src="__CDN__/html/img/hz-img24.png">
            <div class="num js-goods-total-num">{$cart.num}</div>
        </div>
        <div class="bottom-qian js-goods-total-price">合计：{$cart.total_price}元</div>
        <a href="{:url('Cart/comfirmOrder')}"><div class="bottom-bot">去结算</div></a>
    </div>

    <!-- 弹框 -->
    <div class="sy-tank" style="z-index:1;display: none;"></div>
    <div class="sy-tk-list" style="z-index:2;display: none;">
        <div class="gb"><img src="__CDN__/html/img/hz-img25.png" class="tk-img js-close"></div>
        <img src="__CDN__/html/img/hz-img11.png" class="tk-img2 js-goods-logo">
        <div class="tk-wenz">
            <p class="wenz-ps js-title"></p>
            <p class="wenz-ps2 js-desc"></p>   
            <div class="tk-sz">
                <div class="sz-sz js-price"></div>
                <div class="sz-jg">
                    <img src="__CDN__/html/img/hz-img26.png" data-id="0" data-type="1" data-ope="0" class="js-detail-btn img-jg change-num js-tk-dec">
                    <input type="text" value="0" class="text-inp js-tk-buynum"  disabled="disabled">
                    <img src="__CDN__/html/img/hz-img23.png" data-id="0" data-type="1" data-ope="1" class="js-detail-btn img-jg change-num js-tk-inc">
                </div>
            </div>      
        </div>
    </div>
    <!-- 弹框2 -->
    <div class="gw-mains" style="z-index:2;display: none;">
        <h2 class="gw-h2 js-goods-total-num-h2">已选商品（5）</h2>
        <ul class="gw-nav">
            <li>
                <p class="gw-p">【农夫山泉】饮用天然水，5L/桶</p>
                <p class="gw-p2">¥4.00</p>
                <div class="sz-jg">
                    <img src="__CDN__/html/img/hz-img26.png" class="img-jg">
                    <input type="text" value="1" class="text-inp"  disabled="disabled">
                    <img src="__CDN__/html/img/hz-img23.png" class="img-jg">
                </div>           
            </li>
        </ul>
        <div class="sy-bottom">
            <div class="bottom-img">
                <img src="__CDN__/html/img/hz-img24.png">
                <div class="num js-goods-total-num">{$cart.num}</div>
            </div>
            <div class="bottom-qian">合计：{$cart.total_price}元</div>
            <a href="{:url('Cart/comfirmOrder')}"><div class="bottom-bot">去结算</div></a>
        </div>       
    </div>
</div>
{/block}
{block name="script"}

<script src="__CDN__/html/js/swiper.js"></script>
<script src="__CDN__/html/js/scroll.js" type="text/javascript" charset="utf-8"></script>
<script>
    $(".swiper-container").swiper({
        loop: true,
        autoplay: 3000
    });
    myScroll.upScroll("ad-text", "-36px", 3000);
    $(function () {
        FastClick.attach(document.body);
    });
</script>
<script>
//    $('.sy-gw-rig').infinite();
    var p = 1;
    var cate_id = $('#cate_id').val();
    var loading = false;  //状态标记
    mui.init({
        pullRefresh: {
            container: '#pullrefresh',
            up: {
                height: 50, //可选.默认50.触发上拉加载拖动距离
                contentrefresh: '正在加载...',
                contentnomore: '没有更多了', //可选，请求完毕若没有更多数据时显示的提醒内容；
                callback: pullupRefresh
            }
        }
    });
    /**
     * 上拉加载具体业务实现
     */
    function pullupRefresh() {
        $.post("{:url('Index/item')}", {p: p, cate_id: cate_id}, function (res) {
            if (res) {
                $(".sy-gw-rig1").append(res);
                p++;
                mui('#pullrefresh').pullRefresh().endPullupToRefresh(false); //参数为true代表没有更多数据了。
            } else {
                mui('#pullrefresh').pullRefresh().endPullupToRefresh(true); //参数为true代表没有更多数据了。
            }
        }, 'json');
    }
    mui('body').on('tap', 'a', function () {
        window.top.location.href = this.href;
    });
    $(function () {
        mui('body').on('tap', ".change-num", function (res) {
            var id = $(this).attr('data-id');
            var ope = $(this).attr('data-ope');
            var type = $(this).attr('data-type'); //操作类型 0-列表 1-详情

            $.post("{:url('Cart/change')}", {box_goods_id: id, ope: ope}, function (res) {
                if (res.code == '0') {
                    mui.toast(res.msg);
                } else {
                    if (res.code == '80') {
                        if (type == 1) {
                            $('.js-tk-buynum').hide();
                            $('.js-tk-dec').hide();
                            $('.js-tk-buynum').val(0);
                        }

                        //删除
                        $('.js-goods-num-' + id).hide();
                        $('.js-dec-num-' + id).hide();

                        $('.js-goods-num-' + id).val(0);

                    } else if (res.code == '81') {
                        if (type == 1) {
                            $('.js-tk-buynum').show();
                            $('.js-tk-dec').show();
                            $('.js-tk-buynum').val(1);
                        }
                        //新增
                        $('.js-goods-num-' + id).show();
                        $('.js-dec-num-' + id).show();
                        $('.js-goods-num-' + id).val(1);
                    } else if (res.code == '82') { //库存不足
                        $('.js-inc-num-' + id).hide();
                        mui.toast(res.msg);
                        return;
                    } else {

                        //正常增减
                        var num = $('.js-goods-num-' + id).val();
                        if (ope == 1) {
                            num++;
                        } else {
                            num--;
                            $('.js-inc-num-' + id).show();
                        }
                        if (type == 1) {
                            $('.js-tk-buynum').val(num);
                        }
                        $('.js-goods-num-' + id).val(num);
                    }
                    if (type == 3) {
                        $.post("{:url('Index/cart')}", {}, function (res) {
                            if (res) {
                                $('.gw-mains').html(res);
                            } else {
                                hideAll();
                            }

                        }, 'json');
                    }
                    changeTotal(res.data.num, res.data.total_price);

                }
            }, 'json');
        });

        //排序
        mui('body').on('tap', ".js-show-detail", function (res) {
            var id = $(this).attr('data-id');
            $.post("{:url('Cart/getGoodsDetailById')}", {id: id}, function (res) {
                if (res.code == '1') {

                    $('.js-tk-buynum').val(0);
                    $('.js-tk-buynum').hide();
                    $('.js-tk-dec').hide();
                    if (res.data.buy_num > 0) {
                        $('.js-tk-buynum').show();
                        $('.js-tk-dec').show();
                        $('.js-tk-buynum').val(res.data.buy_num);
                    }
                    $('.sy-tank').show();
                    $('.sy-tk-list').show();
                    $('.js-goods-logo').attr("src", res.data.goods_logo);
                    $(".js-title").html("【" + res.data.brand_title + "】" + res.data.goods_title + ',' + res.data.goods_spec);
                    $(".js-desc").html(res.data.goods_desc);
                    $(".js-price").html("¥" + res.data.selling_price);
                    $('.js-detail-btn').attr("data-id", res.data.box_goods_id);
                } else {
                    mui.toast(res.msg);
                }
            }, 'json');
        });

        mui('body').on('tap', ".gw-h2", function (res) {
            hideAll();
        });



        function hideAll() {
            $('.sy-tank').hide();
            $('.sy-tk-list').hide();
            $('.gw-mains').hide();
        }

        function changeTotal(num, price) {
            $(".js-goods-total-num").html(num);
            $(".js-goods-total-num-h2").html("已选商品（" + num + "）");
            $(".js-goods-total-price").html("合计：" + price + "元");
        }
        $('.sy-tank').on('click', function () {
            hideAll();
        });
        $('.js-close').on('click', function () {
            hideAll();
        });

        $('.js-show-cart').on('click', function () {
            $.post("{:url('Index/cart')}", {}, function (res) {
                $('.sy-tank').show();
                $('.gw-mains').html(res);
                $('.gw-mains').show();
            }, 'json');

        });

        $('.js-login').on('click', function () {
            var phone = $('.js-phone').val();
            var password = $('.js-password').val();
            var backurl = $('.js-back-url').val();
            if (!is_mobile(phone)) {
                mui.alert('请填写正确格式手机号');
                return false;
            }
            if (!password) {
                mui.alert('请填写密码');
                return false;
            }
            $.post("{:url('Pub/login')}", {phone: phone, password: password, backurl: backurl}, function (res) {
                if (res.code == '1') {
                    location.href = res.url;
                } else {
                    mui.toast(res.msg);
                }
            }, 'json');

        });
    });

</script>
{/block}